
import React, { useState } from 'react';
import { Modal, Collapse} from 'antd';
import ProForm, {ProFormGroup,  ProFormSelect,ProFormText, ProFormCheckbox} from '@ant-design/pro-form';
import rowresultSet from '@/pages/order/func/row_result_set';

interface DevicedetialFormProps {
  modalVisible: boolean;
  onCancel: () => void;
  result:[{}];
  ids:[];
}

const DevicedetialForm: React.FC<DevicedetialFormProps> = (props) => {
const result = props.result

const { Panel } = Collapse;
  return (
    <Modal
      destroyOnClose
      title={"编辑用户"}
      visible={props.modalVisible}
      onCancel={() => props.onCancel()}
      onOk={() => props.onCancel()}
      width={1000}
    >
      <ProForm
        initialValues={{
        }}
        onFinish={async (values) => {
            const result = {"ids": props.ids, "result": values};
            rowresultSet(result)
        }}
      >
    <Collapse>
        {result.map((item:any) => {
            if (`${item.enable}` === 'true'){
                return (
                <Panel header={item.text} key={item.group}>
                {item.controls.map((i: any) => {
                    if (`${i.type}` === 'combo') {
                        return (
                            <ProFormSelect
                                    width="md"
                                    fieldProps={{
                                    labelInValue: true,
                                    }}
                                    name={item.group+"/"+i.name}
                                    label={i.text}
                                    options={i.option}
                                    initialValue={i.value}
                                />
                        )
                    }
                    if (`${i.type}` === 'text') {
                        return (
                            <ProFormText
                                    width="md"
                                    name={item.group+"/"+i.name}
                                    label={i.text}
                                    initialValue={i.value}
                                />
                        )
                    }
                    if (`${i.type}` === 'check') {
                        return (
                            <ProFormCheckbox.Group
                                    width="md"
                                    name={item.group+"/"+i.name}
                                    label={i.text}
                                    options={["true", "false"]}
                                    initialValue={"true"}
                                />
                        )
                    }
                    if (`${i.type}` === 'node') {
                        return(
                                <>
                                {i.node.map((j: any) => {
                                    if (`${j.type}` === 'text') {
                                        return (
                                            <ProFormText
                                                    width="md"
                                                    name={item.group+"/"+i.name+"/"+j.name}
                                                    label={j.text}
                                                    initialValue={j.value}
                                                />
                                        )
                                    }
                                    if (`${j.type}` === 'combo') {
                                        return (
                                            <ProFormSelect
                                                    width="md"
                                                    fieldProps={{
                                                    labelInValue: true,
                                                    }}
                                                    name={item.group+"/"+i.name+"/"+j.name}
                                                    label={j.text}
                                                    options={j.option}
                                                    initialValue={j.value}
                                                />
                                        )
                                    }
                                    if (`${j.type}` === 'check') {
                                        return (
                                            <ProFormCheckbox.Group
                                                    width="md"
                                                    name={item.group+"/"+i.name+"/"+j.name}
                                                    label={j.text}
                                                    options={["true", "false"]}
                                                    initialValue={"true"}
                                                />
                                        )
                                    }
                                    return <></>
                                        }
                                        )
                                    }
                                    </>
                            )
                            }
                    return <></>
                }
                )}
                </Panel>
                );
            }
            return <></>
            })
        }
    </Collapse>
      </ProForm>
    </Modal>
  );
};

export default DevicedetialForm;
